<template>
	<view>
		<pageHeader  @back='back' :fixed='true' :border='true'>
			<text>评论</text>
		</pageHeader>
		<view style="padding: 0 30rpx 128rpx;">
			<detailComment v-for="(item,index) in commentList" :key='index' :message='item' :index='index' :commentReplies='commentRepliesList[index]' @praise='commentPraise' @dele='getAll'/>
		</view>
		<view class="noResult" v-if="commentList.length<=0">
			<image src="/static/img/noResult.png" mode=""></image>
			<text>暂无评论</text>
		</view>
		<productFooter :isInAllComment='true' @toRefresh='toRefresh' @submit='toSetComment' @collect='collect' @praise='praise' :message='message' :isInput="isInput"/>
	</view>
</template>

<script>
	import urls from "@/common/util/homeArtIndex.js"
	import pageHeader from "@/components/header/header.vue"
	import detailComment from "@/components/comment/detailComment.vue"
	import productFooter from "@/components/footer/productFooter.vue"
	export default {
		components: {pageHeader,detailComment,productFooter},
		data() {
			return {
				id:"",
				state:"",
				message:{},
				isInput:false,
				commentList:[],
				commentRepliesList:[]
			};
		},
		onLoad(e){
			if(localStorage.getItem("designMessage")){
				this.message=JSON.parse(localStorage.getItem("designMessage"))
				localStorage.removeItem("designMessage")
			}
			this.id=e.id
			this.state=e.state
			if(e.isInput){
				this.isInput=true
			}
		},
		onShow() {
			this.getAll()
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			async getAll(e){
				if(e){
					this.message.discussNumber-=1
				}
				let data={}
				data.userId=localStorage.getItem("userId")
				data.state=this.state
				data.answerId=this.id
				let res=await urls.allComment(data)
				this.commentList=res.data.comment?res.data.comment:[]
				this.commentRepliesList=res.data.commentReplies
			},
			async toSetComment(value){
				let data={}
				data.state=this.state
				data.content=value
				data.answerId=this.id
				data.userId=localStorage.getItem("userId")
				let res=await urls.addComment(data)
				if(res.code==0){
					this.message.discussNumber+=1
					this.getAll()
				}
			},
			collect(isAlready){
				if(!isAlready){
					this.message.collection="1"
					this.message.collectionNumber-=1
				}else{
					this.message.collection="0"
					this.message.collectionNumber+=1
				}	
			},
			praise(isAlready){
				if(!isAlready){
					this.message.zan="1"
					this.message.zanNumber-=1
				}else{
					this.message.zan="0"
					this.message.zanNumber+=1
				}	
			},
			toRefresh(){
				this.getAll()
			},
			commentPraise(index,isAlready){
				if(!isAlready){
					this.commentList[index].zan="1"
					this.commentList[index].zanNumber-=1
				}else{
					this.commentList[index].zan="0"
					this.commentList[index].zanNumber+=1
				}	
			},
		},
	}
</script>

<style lang="scss">
.top_padding{
	height: 1rpx;
	background-color: #EEEEEE;
	position: fixed;
	width: 750rpx;
	top: 85rpx;
	z-index: 999;
}

.noResult{
	display: flex;
	flex-flow: column;
	align-items: center;
	padding-top: 143rpx;
	image{
		height: 289rpx;
		width: 374rpx;
		display: block;
	}
	text{
		font-size: 30rpx;
		color: #333333;
		letter-spacing: 1rpx;
		margin-top: 60rpx;
	}
}
</style>
